// 这个文件就是webpack的默认配置文件， 默认的名称是：webpack.congfig.js
// 将来只需要在cmd面板上执行webpack就会自动去查找webpack.config.js中的内容进行相关的打包操作
var path=require('path');
var htmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
	entry:'./src/main.js',  //webpack 要打包的源文件是 ./src/main.js
	output:{
		// path:'./dist/',  //告诉webpack以后所有打包的文件放置位置，图片之类的
		path:path.join(__dirname,'./dist/'),
		filename:'build.js' //打包结束后输出的文件名,
	},
	module:{
		loaders:[
			{
				test:/\.js$/,
				exclude:/node-modules/, //表示排除node_modules文件下的js
				//loader:'babel-loader'  //表示使用babel-loader去转换所有js中es6的语法为es5语法
				// loader:'babel-loader?preset[]=es2015'  //*********************不推荐***********************
				
			},
			{
				test:/\.css$/,
				loader:'style-loader!css-loader!autoprefixer-loader'  
				//加载顺序先执行css-loader 再执行style-loader，所以顺序一定不能颠倒，最后再加上autoprefixer-loader自动前缀
			},
			{
				test:/\.less$/,
				loader:'style-loader!css-loader!autoprefixer-loader!less-loader'  
				//加载顺序先执行css-loader 再执行style-loader，所以顺序一定不能颠倒，最后再加上autoprefixer-loader自动前缀
			},
			{
				test:/\.scss$/,
				loader:'style-loader!css-loader!autoprefixer-loader!sass-loader'  
				//加载顺序先执行css-loader 再执行style-loader，所以顺序一定不能颠倒，最后再加上autoprefixer-loader自动前缀
			},
			{
				test:/\.(png|jpg|ttf)$/,  //表示匹配的文件后缀名为.png  .jpg也可以自己增加
				loader:'url-loader?limit=40000'  //这里是缩写形式 url-loader,后面的limit表示如果图片大小小于40000则将这张图片编译成base64字符串给浏览器使用，否则将图片打包到编译器中(图片大小不变)，这里注意一下，这里的值不能太大，否则会影响build.js的性能
			}
		]
	},
	plugins:[
		new htmlWebpackPlugin({
			title:'index', //生成的页面标题
			filename:'index.html',  //生成的文件名称
			template:'index.html'  //根据index.html这个模板来生成
		})
	]
}